<html lang="zh-CN">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta content="yes" name="apple-mobile-web-app-capable">
    <meta content="yes" name="apple-touch-fullscreen">
    <meta content="telephone=no,email=no" name="format-detection">
    <title>邻阿姨(LAY.COM)-去哪买,超市比价,附近价差排行,邻居互助</title>
    <link rel="stylesheet" type="text/css" href="../js/cube-ui/cube.min.css"/>
    <link rel="stylesheet" type="text/css" href="css/searchList201906040920.css"/>
</head>
<body>
    <div class="app-shell" id="search" v-cloak>
        <div class="search-main">
            <div class="search-header">
                <i class="search-goback" @click="goback()">返回</i>
                <form action="javascript:void(0);" onsubmit="return false;"><input type="search" v-model.trim="key" autocomplete="off" placeholder="请输入搜索内容" class="search-headerInput" @keypress="search" @blur="blurSearch" @focus="focusSearch" @input="changeUrl()"></form>
                <span class="search-headerBtn" @click="clickSearch" v-if="isSearch">搜索</span>
                <span class="search-function" @click="toFunction" v-else></span>
            </div>

            <div class="search-container">
                <div class="search-goodsListBox" v-if="searchData && searchData.length > 0">
                    <div class="search-goodsHeader">
                        <div class="search-goodsTab" v-for="(tab,index) in sortTab" :key="index" :class="{'search-goodsTabActive': index === tabIndex}" @click="changeTab(index)">
                            <span :class="{'search-goodsTabPrice': index === 1}">{{tab.title}}
                                <i class="search-goodsTabArrowUp" :class="{'search-goodsTabArrowUpActive': orderType === 'PRICE_UP'}" v-if="index === 1"></i>
                                <i class="search-goodsTabArrowDown" :class="{'search-goodsTabArrowDownActive': orderType === 'PRICE_DOWN'}" v-if="index === 1"></i>
                            </span>
                        </div>
                    </div>
                    <div class="search-goodsList">
                        <cube-scroll
                            ref="goodsList"
                            :data="searchData"
                            :options="scrollOptions"
                            :scroll-events="['scroll']"
                            @scroll="onScrollHandle"
                            @pulling-up="searchMore">
                            <ul>
                                <li class="search-goodsBox" v-for="(goods,index) in searchData" :key="index">
                                    <img :src="goods.image" class="search-goodsImg">
                                    <div class="search-goodsInfo">
                                        <h3 class="search-goodsName">{{goods.fullName}}</h3>
                                        <p class="search-goodsDescribe">规格：{{goods.attrValues}}</p>
                                        <p class="search-goodsSpread">价差率：{{goods.spreadRate}}%</p>
                                        <div class="search-goodsPriceBox">
                                            <em class="search-goodsRMB">￥</em><span class="search-goodsPrice">{{goods.minPrice}}</span>
                                            <div class="search-goodsTriangle" @click="morePrice($event,index)">比价</div>
                                        </div>
                                        <a class="search-goodsBtn" @click="placeOrder(index)">立即下单</a>
                                    </div>
                                </li>
                            </ul>
                        </cube-scroll>
                    </div>
                </div>

                <div class="search-noGoodsBox" v-else-if="searchData && searchData.length === 0">
                    <div class="search-noGoods">暂无此商品<button class="search-noGoodsBtn" @click="toCustom">自定义下单</button></div>
                </div>

                <div class="search-historyBox" v-if="showSearchHistory">
                    <div class="search-historyHeader">历史搜索：<span class="search-historyBtn" @click="delSearchHistory()"></span></div>
                    <div class="search-historyListBox">
                        <ul class="search-historyList">
                            <li class="search-history" v-for="(item,index) in searchHistory" :key="index" @click="searchType(item)">{{item.key}}</li>
                        </ul>
                    </div>
                </div>
            </div>

            <cube-popup type="my-popup" :position="position" :mask-closable="true" ref="myPopup4">
                <div class="search-addCartBox">
                    <div class="search-addCartGoods" v-if="searchData && searchData.length > 0">
                        <img :src="searchData[addCartIndex].image" class="search-addCartGoodsImg">
                        <div class="search-addCartGoodsInfo">
                            <h1 class="search-addCartGoodsName">{{searchData[addCartIndex].fullName}}</h1>
                            <span class="search-addCartGoodsNorms">规格：{{searchData[addCartIndex].attrValues}}</span>
                            <span class="search-addCartGoodsSpread">价差率：{{searchData[addCartIndex].spreadRate}}%</span>
                            <div class="search-addCartGoodsPriceBox"><em class="search-addCartGoodsRMB">￥</em><span class="search-addCartGoodsPrice">{{searchData[addCartIndex].minPrice}}</span></div>
                            <div class="search-addCartStep"><i class="search-addCartReduce" @click="reduce()"></i><span class="search-addCartNum">{{num}}</span><i class="search-addCartPlus" @click="plus()"></i></div>
                        </div>
                    </div>
                    <div class="search-btnAddCartBox">
                        <div class="search-btnAddCart" @click="addCart()">加入购物车</div>
                        <div class="search-btnDirectBuy" @click="toBUy()">直接购买</div>
                        <!-- <div class="search-btnAddCart" @click="addCart()">加入购物车</div> -->
                    </div>
                </div>
            </cube-popup>

            <div class="search-popupBox" v-show="showPopup">
                <div class="search-popupMask" @click="closePopup()"></div>
                <div class="search-popupContent" :style="popupTop" ref="searchPopup">
                    <i class="search-popupTriangleTop" :style="triangleStyle" v-if="popupTriangle === 'top'"></i>
                    <i class="search-popupTriangleBottom" :style="triangleStyle" v-else-if="popupTriangle === 'bottom'"></i>
                    <div class="search-popup" v-if="searchData && searchData.length > 0">
                        <div class="search-popupTitle">附近超市比价</div>
                        <div class="search-popupGoodsBox">
                            <div>
                                <img :src="searchData[popupIndex].image" class="search-popupGoodsImg">
                                <p class="search-popupGoodsSpread">最高价差率</p>
                                <p class="search-popupGoodsOrange"><span class="search-popupGoodsBig">{{searchData[popupIndex].spreadRate}}</span>%</p>
                            </div>
                            <div>
                                <div class="search-popupGoodsName">{{searchData[popupIndex].fullName}}</div>
                                <div class="search-popupMarket">
                                    <ul>
                                        <li class="search-popupMarketList" v-for="(market,index) in marketData" :key="index"><span class="search-popupMarketName">{{market.supermarketName}}</span><span class="search-popupMarketPrice">{{market.price}}</span></li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="search-custom" :class="[scrollUp ? 'search-customOpen' : 'search-customClose']" v-if="searchData && searchData.length > 0" @click="toCustom">自定义下单</div>

            <div v-show="isFunctionMask">
                <div class="search-throughMask" v-show="isFunctionMask" @click="closeFunction"></div>
                <div class="search-throughBox" :class="[isFunction ? 'search-throughBoxOpen' : 'search-throughBoxClose']">
                    <div class="search-throughHeader">功能直达<span class="search-throughClose" @click="closeFunction"></span></div>
                    <div class="search-throughLinkBox">
                        <a href="../index.html" class="search-throughLink linkthrough-home">首页</a>
                        <a href="../msg/msg.html" class="search-throughLink linkthrough-msg">消息</a>
                        <a href="../shopping/shopping.html" class="search-throughLink linkthrough-cart">购物车<i class="search-cartBadge" v-if="cartBadge && cartBadge !== 0">{{cartBadge}}</i></a>
                        <a href="javascript:void(0);" class="search-throughLink linkthrough-share" @click="toShare">分享</a>
                    </div>
                </div>
            </div>


            <cube-popup type="my-popup" position="bottom" :mask-closable="true" ref="share">
                <div class="search-shareBox">
                    <div class="search-shareHeader">分享至<span class="search-shareClose" @click="closeShare"></span></div>
                    <div class="search-shareContainer">
                        <div class="search-shareTab search-shareWeChat" @click="shareTips">微信好友</div>
                        <div class="search-shareTab search-shareCircle" @click="shareTips">微信朋友圈</div>
                    </div>
                </div>
            </cube-popup>

            <cube-popup type="my-popup" position="top" :mask-closable="true" ref="shareTips">
                <div class="search-shareTipsBox">
                    <img src="../image/icon-sendLine.png" class="search-sendLineImg">
                    <div class="search-shareTips">1.点击右上角<br>2.点击<img :src="sendFriends" :class="[isAndroid ? 'search-sendFriendsAndroid' : 'search-sendFriends']">发送给朋友或<img :src="sendCircle" class="search-sendCircle">分享到朋友圈</div>
                </div>
            </cube-popup>
        </div>
    </div>
    <script src="../js/vue.js"></script>
    <script src="../js/axios.min.js"></script>
    <script src="../js/fetch20190612.js"></script>
    <script src="../js/rem.js"></script>
    <script src="../js/cube-ui/cube.min.js"></script>
    <script src="../js/jweixin-1.3.0.js"></script>
    <script src="js/searchList201906151810.js"></script>
</body>
</html>
